<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <input type="text" value="" id="num1">
    <select name="请选择" id="" >
        <option value="moren">请选择</option>
        <option value="jia">+</option>
        <option value="jian">-</option>
        <option value="cheng">*</option>
        <option value="chu">/</option>
    </select>
    <input type="text" value="" id="num2">
    <button>=</button>
    <input type="text" id="num3">
    <script src="./jquery-1.12.4.min.js"></script>
    <script>
        var obj = document.getElementsByTagName("option")
        var num1 = document.getElementById("num1")
        var num2 = document.getElementById("num2")
        var num3 = document.getElementById("num3")
        var btn = document.getElementsByTagName("button")[0]
        // console.log(obj[0].value)
        // console.log(num2)
        // console.log(btn)
        // num3.value = 3
        btn.onclick = function() {
            var sel;
            var n1 = Number(num1.value)
            var n2 = Number(num2.value)
            for(i=0;i<obj.length;i++) {
                if(obj[i].selected==true) {
                    sel = obj[i].value
                }
            }
            switch(sel) {
                case "jia":
                    num3.value = n1+ n2
                    break;
                case "jian":
                    num3.value = n1 - n2
                    break;
                case "cheng":
                    num3.value = n1 * n2
                    break;
                case "chu":
                    num3.value = n1 / n2
                    break;
                case "moren":
                    alert("请选择正确的运算符")
                    break
                
            }
        }
    </script>
</body>
</html>